<template>
  <div class="vehicleUpdateInfoComp h100">
    <div class="vehicleUpdateInfoCompSearch">
      <car-model-detail-update-info-search
        @alertview="alertShowViewType"
        @search="searchData">
      </car-model-detail-update-info-search>
    </div>
    <div class="vehicleUpdateInfoCompMain">
      <component :is="updateInfoMainCompName" ref="updateInfoMainComp" :time="time"></component>
    </div>
  </div>
</template>
<script>
import CarModelDetailUpdateInfoTimeline from './CarModelDetailUpdateInfoTimeline'
import CarModelDetailUpdateInfoTable from './CarModelDetailUpdateInfoTable'
import CarModelDetailUpdateInfoSearch from './CarModelDetailUpdateInfoSearch'
export default {
  components: {
    CarModelDetailUpdateInfoTimeline,
    CarModelDetailUpdateInfoTable,
    CarModelDetailUpdateInfoSearch
  },
  props: {
    time: {
      type: Number,
      default: 3571592
    }
  },
  data () {
    return {
      updateInfoMainCompName: 'CarModelDetailUpdateInfoTimeline',
      showViewType: 'timeline'
    }
  },
  created () {
  },
  methods: {
    alertShowViewType (comp) {
      this.updateInfoMainCompName = comp
    },
    searchData () {
      this.$refs.updateInfoMainComp.getData()
    }
  }
}
</script>
<style scoped lang="less">
.vehicleUpdateInfoComp {
  display: flex;
  flex-direction: column;
  .vehicleUpdateInfoCompSearch {
    flex:none;
    margin-bottom: 20px;
  }
  .vehicleUpdateInfoCompMain {
    flex:1 0 0;
    overflow: auto;
  }
}
</style>
